import { Button, Card, Form, Input, message } from 'antd';
import { useForm } from 'antd/lib/form/Form';
import FormItem from 'antd/lib/form/FormItem';
import React, { useEffect, useState } from 'react'
import { useNavigate, useParams } from 'react-router-dom';
import {reqAddHospital, reqGetHospital, reqUpdateHospital} from "@/api/hospital/hospitalSet"

export default function AddOrUpdateHospital() {
    let navigate = useNavigate()

    let [form] = useForm()

    // 获取id
    let {id} = useParams()

    // 设置loading
    let [loading,setLoading] = useState(false)

    // 获取表单数据
    let finish = async ()=>{
      // 获取表单数据
      let value = form.getFieldsValue()

      if(!id){
        setLoading(true)
         // 发送请求
      await reqAddHospital(value)

      setLoading(false)
      // 添加成功提示
      message.success("新增成功")

      }else{

        setLoading(true)

            //修改医院信息
        await reqUpdateHospital({
          ...value,
          id
        })

        setLoading(false)

        message.success("修改成功")
      }
    
      // 跳转到设置
      navigate("/syt/dashboard/hospitalSet")
    }

    // 请求单个医院信息
    let gethospital = async()=>{
      let result = await reqGetHospital(id as string)

        //设置表格数据回显
      form.setFieldsValue(result)
    }

    //页面初始化
    useEffect(()=>{
      gethospital()
    },[])
  return (
    <Card>
        <Form 
        form={form}
        onFinish={finish}
        labelCol={{span:2}}
        wrapperCol={{span:18}}
        autoComplete="off"
        >
            <Form.Item 
            label="医院名称"
            name="hosname"
            rules={[{required:true,
            message:'请输入医院名称'
          }]}
            
            >
              <Input></Input>

            </Form.Item>

            <Form.Item 
            label="医院编号"
            name="hoscode"
            rules={[{required:true,
            message:'请输入医院编号'
          }]}
            
            >
              <Input></Input>

            </Form.Item>

            <Form.Item 
            label="api基础路径"
            name="apiUrl"
            rules={[{required:true,
            message:'请输入api基础路径'
          }]}
            
            >
              <Input></Input>

            </Form.Item>

            <Form.Item 
            label="联系人姓名"
            name="contactsName"
            rules={[{required:true,
            message:'联系人姓名不能为空'
          }]}
            
            >
              <Input></Input>

            </Form.Item>

            <Form.Item
                        label="联系人手机"
                        name="contactsPhone"
                        rules={[{ required: true, message: '联系人手机号不能为空' },
                        {pattern: /^1[3-9][0-9]{9}$/, message: '请输入合法的手机号'}]}
                    >
                        <Input />
                    </Form.Item>

              <Form.Item 
              wrapperCol={{offset:2,span:18}}
              >
                <Button 
                loading={loading}
                type='primary'
                htmlType='submit'
                >
                保存
                </Button>

                <Button
                type='default'
                onClick={()=>{
                  navigate(-1)
                }}
                >
                 返回
                </Button>


              </Form.Item>
            
        </Form>
    </Card>
  )
}
